<template>
  <div>
    <div class="comment-wrap">
      <div class="content">
        <div
          v-for="item in suggestionList"
          :key="item.id"
          class="comment"
          @click="goDetail">
          <div class="company">
            <img src="../../../static/images/Reply.png" alt="">
            {{item.classify}}
          </div>
          <p class="title">{{item.reply}}</p>
          <div class="problem">
            <div class="user">{{item.name}} 来自 {{item.place}}</div>
            <p class="user-problem">{{item.content}}</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { formatTime } from "@/utils/index";
import card from "@/components/card";
import { mapActions, mapState } from 'vuex';
export default {
  components: {
    card
  },

  data() {
    return {};
  },
  computed: {
    ...mapState(['suggestionList']),
  },
  mounted() {
    this.getSuggestionList();
  },
  methods:{
    ...mapActions(['getSuggestionList']),
    goDetail () {
      return;
      this.$router.push('/pages/adviseDetail/index')
    }
  },
  beforeMount() {},
  created() {}
};
</script>

<style lang="scss" scoped>
.comment-wrap {
  background: #eff4f7;
  padding: 28rpx;
  .content {
    background: #fff;
    padding: 0 38rpx;
    .header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      line-height: 106rpx;
      height: 106rpx;
      font-size: 40rpx;
      border-bottom: 1px solid #e7e7e7;
      .more {
        font-size: 26rpx;
        color: #9a9b9a;
        img {
          width: 14rpx;
          height: 24rpx;
          margin-left: 12rpx;
        }
      }
    }
    .comment {
      padding: 16rpx 0 35rpx 0;
      border-bottom: 1px solid #ededed;
      .company {
        height: 64rpx;
        display: flex;
        align-items: center;
        font-size: 26rpx;
        img {
          width: 30rpx;
          height: 30rpx;
          margin-right: 12rpx;
        }
      }
      .title {
        font-size: 30rpx;
        line-height: 44rpx;
      }
    }
    .problem {
      margin-top: 30rpx;
      padding: 30rpx 40rpx;
      font-size: 26rpx;
      color: #a0a59f;
      background: #eff4f7;
      .user-problem {
        color: #000;
      }
    }
  }
}
</style>

